<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
<script src="../resources/picker-common.js"></script>
</head>
<body>
<select id="menu">
  <option>foo</option>
  <option selected>bar</option>
  <option>baz</option>
</select>
<select id="menu2" style="font-size:13px; font-family:Arial">
  <option>option1</option>
  <option>option2</option>
  <option>option3</option>
  <option>option4</option>
  <option>option5</option>
  <option>option6</option>
  <option>option7</option>
  <option>option8</option>
  <option>option9</option>
  <option>option10</option>
  <option>option11</option>
  <option>option12</option>
  <option>option13</option>
  <option>option14</option>
  <option>option15</option>
  <option>option16</option>
  <option>option17</option>
  <option>option18</option>
  <option>option19</option>
  <option>option20</option>
  <option>option21</option>
</select>
<script>
var menuElement = document.getElementById('menu');
var menuElement2 = document.getElementById('menu2');
var picker = null;
var clickEventCounter = 0;
menuElement.addEventListener('click', function() { clickEventCounter++; }, false);
var mouseupEventCounter = 0;
menuElement.addEventListener('mouseup', function() { mouseupEventCounter++; }, false);

function openPickerErrorCallback() {
    testFailed('picker didn\'t open')
    finishJSTest();
}
openPicker(menu, test1, openPickerErrorCallback);
function test1() {
    picker = internals.pagePopupWindow.global.picker;
    shouldBeEqualToString('picker._selectElement.value', '1');
    shouldBeEqualToString('menuElement.value', 'bar');

    hoverOverElement(picker._selectElement.children[0]);
    shouldBeEqualToString('picker._selectElement.value', '0');
    shouldBeEqualToString('menuElement.value', 'bar');

    hoverOverElement(picker._selectElement.children[1]);
    shouldBeEqualToString('picker._selectElement.value', '1');
    shouldBeEqualToString('menuElement.value', 'bar');

    hoverOverElement(menuElement);
    shouldBeEqualToString('picker._selectElement.value', '1');
    shouldBeEqualToString('menuElement.value', 'bar');

    // Start drag selecting but release outside the popup.
    hoverOverElement(picker._selectElement.children[2]);
    eventSender.mouseDown();
    hoverOverElement(picker._selectElement.children[0]);
    hoverOverElement(menuElement);
    eventSender.mouseUp();
    shouldNotBe('internals.pagePopupWindow', 'null');
    shouldBeEqualToString('picker._selectElement.value', '0');
    shouldBeEqualToString('menuElement.value', 'bar');

    shouldBe('clickEventCounter', '0');
    shouldBe('mouseupEventCounter', '0');

    clickElement(picker._selectElement.children[2]);
    shouldBeNull('internals.pagePopupWindow');
    shouldBeEqualToString('menuElement.value', 'baz');

    shouldBe('clickEventCounter', '1');
    shouldBe('mouseupEventCounter', '1');

    waitUntilClosing(function() {
        openPicker(menu, test2, openPickerErrorCallback);
    });
}

function test2() {
    picker = internals.pagePopupWindow.global.picker;
    shouldBeEqualToString('picker._selectElement.value', '2');
    shouldBeEqualToString('internals.selectMenuListText(menu)', 'baz');

    eventSender.keyDown('ArrowUp');
    shouldBeEqualToString('picker._selectElement.value', '1');
    shouldBeEqualToString('menu.value', 'baz');
    shouldBeEqualToString('internals.selectMenuListText(menu)', 'bar');

    // click outside to close popup
    eventSender.mouseMoveTo(300, 1);
    eventSender.mouseDown();
    eventSender.mouseUp();
    shouldBeNull('internals.pagePopupWindow');
    shouldBeEqualToString('menu.value', 'bar');
    shouldBeEqualToString('internals.selectMenuListText(menu)', 'bar');

    waitUntilClosing(function() {
        openPicker(menu2, test3, openPickerErrorCallback);
    });
}

function test3() {
    picker = internals.pagePopupWindow.global.picker;
    // We had a bug that almost-invisible OPTION was selected and the popup was
    // scrolled. crbug.com/558287.
    eventSender.mouseMoveTo(10, picker._selectElement.offsetHeight - 2);
    shouldBeEqualToString('picker._selectElement.selectedOptions[0].label', 'option20');

    finishJSTest();
}


</script>
</body>
</html>
